<template>
  <div class="select">
    <form id="form_lm" >
		<table border="1" cellspacing="0" cellpadding="0">
			<tr>
				<th class="td_name1">玩法</th>
				<td class="td_time1">赔率</td>
				<td class="td_amount1">金额</td>
		
				<th class="td_name1">玩法</th>
				<td class="td_time1">赔率</td>
				<td class="td_amount1">金额</td>
			</tr>
			<tr v-for='item in wanfa'>
				<th class="td_name">{{ item.left.playName }}</th>
				<td class="td_time">1.88</td>
				<td class="td_amount"><input type="number" :name="item.left.name" @blur='addCount' /></td>
				<th class="td_name">{{ item.right.playName }}</th>
				<td class="td_time">1.88</td>
				<td class="td_amount"><input type="number" :name="item.right.name" @blur='addCount' /></td>
			</tr>
		</table>
    </form>

    <div class="bottom">
      总金额共{{ count }}元
      <el-button type="warning" @click='addTouzhu' >添加投注</el-button>
    </div>
    <el-dialog title="提示" :visible.sync="centerDialogVisible" width="30%" center>
    	<div class="dialogCgj">
    		<h3 class="red">你确定要加入{{ caipiaoTerm }}期吗？</h3>
    		<ul>
    			<li v-for="(item, index) in params">
    				<div class="flex"><span style="white-space: nowrap;">
        					号码：</span><span class="red single_ellipsis">{{item.number}} 号</span> 赔率：
    					</span><span class="red single_ellipsis">{{item.peilv}}</span> 金额：
    					</span><span class="red single_ellipsis">{{item.amount}} 元</span>
    				</div>
    			</li>
    		</ul>
    		总金额：<span class="red">{{ count }} 元</span>
    	</div>
    	<span slot="footer" class="dialog-footer">
            <el-button @click="centerDialogVisible = false">取消投注</el-button>
            <el-button type="primary" @click="addSendData">确定投注</el-button>
          </span>
    </el-dialog>
  </div>
</template>

<script>
	import $ from 'jquery'
  import addCount from '../../../../../../assets/js/hallCount.js'
  import lhcTouZhu from '../../../../../../assets/js/lhcTouZhu.js'
  
  export default {
  	props: ['caipiaoTerm'],
    data () {
      return {
      	centerDialogVisible: false,
      	wanfa: [
      		{
      			left: {
      				playName: '特大',
      				name: 'teda'
      			},
      			right: {
      				playName: '特天肖',
      				name: 'tetianxiao'
      			}
      		},
      		{
      			left: {
      				playName: '特小',
      				name: 'texiao'
      			},
      			right: {
      				playName: '特地肖',
      				name: 'tedixiao'
      			}
      		},
      		{
      			left: {
      				playName: '特尾大',
      				name: 'teweida'
      			},
      			right: {
      				playName: '特前肖',
      				name: 'teqianxiao'
      			}
      		},
      		{
      			left: {
      				playName: '特尾小',
      				name: 'teweixiao'
      			},
      			right: {
      				playName: '特后肖',
      				name: 'tehouxiao'
      			}
      		},
      		{
      			left: {
      				playName: '特单',
      				name: 'tedan'
      			},
      			right: {
      				playName: '特家肖',
      				name: 'tejiaxiao'
      			}
      		},
      		{
      			left: {
      				playName: '特双',
      				name: 'teshuang'
      			},
      			right: {
      				playName: '特野肖',
      				name: 'teyexiao'
      			}
      		},
      		{
      			left: {
      				playName: '特合大',
      				name: 'teheda'
      			},
      			right: {
      				playName: '总大',
      				name: 'zongda'
      			}
      		},
      		{
      			left: {
      				playName: '特合小',
      				name: 'tehexiao'
      			},
      			right: {
      				playName: '总小',
      				name: 'zongxiao'
      			}
      		},
      		{
      			left: {
      				playName: '特合单',
      				name: 'tehedan'
      			},
      			right: {
      				playName: '总单',
      				name: 'zongdan'
      			}
      		},
      		{
      			left: {
      				playName: '特合双',
      				name: 'teheshuang'
      			},
      			right: {
      				playName: '总双',
      				name: 'zongshuang'
      			}
      		}
      	],
      	count: 0,
      	form: [],
      	eleForm: '#form_lm',
      	params: [],
      	gameType: 15,
      	ticketId: 20
      }
    },
    methods: {
    	addTouzhu () {
    		this.params = []
      	let str = $('#form_lm').serialize()
      	this.form = str.split('&')
      	this.params = lhcTouZhu(this.form, this.gameType, this.caipiaoTerm, this.ticketId)
      	console.log(this.params)
      	this.centerDialogVisible = true
      },
      addCount () {
      	this.count = addCount(this.eleForm)
      },
      addSendData () {
      	this.centerDialogVisible = false
      	this.params.forEach((item, index) => {
      		let params2 = {}
      		params2.lhcCalls = []
      		params2.lhcCalls.push(item)
      		this.$api.lhc_call_call(item).then((res) => {
	      		console.log(res)
	      		if(res.code == "000000") {
	      			this.$message.success('投注成功')
	      		}
	      	})
      	})
      }
    }

  }
</script>

<style lang="less" scoped>
  @import "../../../style/game";

  .td_name {
    text-align: center;
    width: 70px!important;
  }
  .select .td_time{

  }
  .round {
    margin-left: 10px;
  }
  .td_amount input{
    width: 100px;
  }
  .td_amount1{
    width: 120px;
  }
</style>
